<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>健身房私教课程预约</title>
    <link rel="stylesheet" href="../static/css/bootstrap.min.css">
    <script src="../static/js/bootstrap.min.js"></script>
    <style>
        html{
          height: 100%;
        }
        p {
            color: white;
        }
        .navbar {
            background-color: #343a40;
        }
        .navbar-brand {
            font-size: 1.5rem;
            font-weight: bold;
        }
        .nav-link {
            font-size: 1.2rem;
            font-weight: bold;
        }
        hr {
            border-top: 2px solid white;
        }
        .container-fluidr {
            margin-top: 2rem;
        }
        .card {
            margin: 1rem;
            box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
        }
        .card-title {
            font-size: 1.5rem;
            font-weight: bold;
        }
        .card-subtitle {
            font-size: 1.2rem;
            font-weight: bold;
        }
        .form-control {
            font-size: 1.2rem;
        }
        .btn {
            font-size: 1.2rem;
            font-weight: bold;
            margin: 0.5rem;
        }
        table {
            margin: 1rem;
        }
        th {
            font-size: 1.2rem;
            font-weight: bold;
        }
        td {
            font-size: 1.2rem;
        }
    </style>
</head>

<body>
    <nav class="navbar navbar-dark bg-dark">
        <div class="container-fluid">
            <a class="navbar-brand" href="">个人中心</a>
            <div>
                <a href="{{ url_for('logout') }}">退出登录</a>
                <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
                    <span class="navbar-toggler-icon"></span>
                </button>
            </div>
            <div class="collapse navbar-collapse" id="navbarSupportedContent">
                <ul class="navbar-nav me-auto mb-2 mb-lg-0">
                    <li class="nav-item">
                        <a class="nav-link" aria-current="page" href="{{ url_for('index') }}">系统主页</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" aria-current="page" href="{{ url_for('order') }}">预约中心</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link active" href="{{ url_for('mine') }}">个人中心</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" href="{{ url_for('search') }}">搜索课程</a>
                    </li>
                    <li class="nav-item dropdown">
                        <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-bs-toggle="dropdown" aria-expanded="false">
                            帮助
                        </a>
                        <ul class="dropdown-menu" aria-labelledby="navbarDropdown">
                            <li><a class="dropdown-item" href="{{ url_for('regulation') }}">规章制度</a></li>
                        </ul>
                    </li>
                </ul>
            </div>
        </div>
    </nav>
    <hr/>
    <div class="container-fluidr">
        <div class="p-3">
            <h3 class="mb-3">个人信息</h3>
        </div>
        <div class="row p-2">
            <div class="card" style="width: 30rem;">
                <div class="card-body">
                    <h5 class="card-title">用户名称：{{ username }}</h5>
                    <h6 class="card-title">用户信息</h6>
                    <h6 class="card-subtitle mb-2 text-muted">会员账号：{{ user.student_id }}</h6>
                    <h6 class="card-subtitle mb-2 text-muted">注册时间：{{ user.register_time }}</h6>
                    <h6 class="card-subtitle mb-2 text-muted">会员到期日：{{ user.end_time }}</h6> 
                    <h6 class="card-subtitle mb-2 text-muted">手机号：{{ user.student_phone }}</h6> 
                </div> 
            </div> 
        <div class="card" style="width: 30rem;"> 
            <div class="card-body"> <h5 class="card-title">修改密码</h5> <form action="/mine", method="POST"> 
                <div class="input-group input-group-sm mb-3"> 
                    <span class="input-group-text" id="inputGroup-sizing-sm">原密码</span> 
                    <input type="password" class="form-control" aria-label="Sizing example input" aria-describedby="inputGroup-sizing-sm" name="old_password"> 
                </div> <div class="input-group input-group-sm mb-3"> 
                    <span class="input-group-text" id="inputGroup-sizing-sm">输入新密码</span> 
                    <input type="password" class="form-control" aria-label="Sizing example input" aria-describedby="inputGroup-sizing-sm" name="new_password"> </div> 
                    <div class="input-group input-group-sm mb-3"> <span class="input-group-text" id="inputGroup-sizing-sm">确认密码</span> 
                        <input type="password" class="form-control" aria-label="Sizing example input" aria-describedby="inputGroup-sizing-sm" name="sure_password"> 
                    </div> 
                        <p style="color: red">{{ wrong }}</p> 
                    <div class="d-grid gap-2 col-6 mx-auto"> 
                        <button type="submit" class="btn btn-secondary">修改密码</button> 
                        <a type="button" href="{{ url_for('logout') }}" class="btn btn-secondary">退出登录</a> 
                    </div> </form> </div> </div> </div> <div class="p-3"> 
                        <h3 class="mb-3">我的预约</h3> </div> 
                        <div style="width:100%;background-color: white;"> 
                            <table class="table"> 
                                <thead> 
                                    <tr> 
                                        <th scope="col">课程名称</th> 
                                        <th scope="col">地点</th> 
                                        <th scope="col">座位号</th> 
                                        <th scope="col">日期</th> 
                                        <th scope="col">操作</th> 
                                    </tr> 
                                </thead> 
                                <tbody> 
                                    {% for mi_app in mine_appointment %} 
                                        <tr> 
                                            <th scope="row">{{ mi_app[1] }}</th> 
                                            <td>{{ mi_app[2] }}</td> 
                                            <td>{{ mi_app[3] }}</td> 
                                            <td>{{ mi_app[4] }}</td> 
                                            <td>
                                                <!--数据库操作--> 
                                                <form action="/sign" method="POST"> 
                                                    <select name="mine_sign" style="display: none"> 
                                                        <option selected="selected">{{ mi_app[0] }}</option> 
                                                    </select> 
                                                    {% if mi_app[5] == 0 %} 
                                                    <button id="bn-1" type="submit" class="btn btn-success">签到</button> 
                                                    {% elif mi_app[5] == 1 %} 
                                                    <button id="bn-1" type="submit" class="btn btn-success" disabled="disabled">已签到</button> 
                                                    {% endif %} 
                                                </form> 
                                            </td> 
                                        </tr> 
                                    {% endfor %} 
                                </tbody> 
                            </table> 
                        </div> 
                </div> 
        </body> 
    </html>